import "@babel/polyfill";
import Vue from "vue";
import axios from "axios";
import AppConf from "./config";
import promise from "es6-promise";
promise.polyfill();

import ElementUI from "element-ui";
import "element-ui/lib/theme-chalk/index.css";
import "font-awesome/css/font-awesome.min.css";

import App from "./App.vue";
import router from "./router";
import store from "./store";
import * as filters from "./filters";
import VueParticles from "vue-particles";
import VueVideoPlayer from "vue-video-player";

// require videojs style
import "video.js/dist/video-js.css";
// import 'vue-video-player/src/custom-theme.css'

Vue.use(
  VueVideoPlayer /* {
  options: global default options,
  events: global videojs events
} */
);
// 导入过滤器
Object.keys(filters).forEach(key => {
  Vue.filter(key, filters[key]);
});

Vue.use(AppConf);
Vue.use(ElementUI);
Vue.use(VueParticles);
Vue.config.productionTip = false;

// Todo 将中断器重构成可配置项
axios.interceptors.request.use(
  function(config) {
    config.headers.token = window.sessionStorage.getItem("token");
    config.headers.clientId = "ADMIN";
    config.headers.version = "1.0.0";
    return config;
  },
  function(error) {
    // Do something with request error
    return Promise.reject(error);
  }
);

axios.interceptors.response.use(
  response => {
    // Do something with response data
    if (response.data.errorCode !== 0) {
      Vue.prototype.$notify.error({
        title: "错误",
        message: response.data.errorMsg
      });
      return Promise.reject(response.data);
    } else {
      return response;
    }
  },
  error => {
    // Do something with response error
    console.log(error.response);
    if (error.response.status >= 500) {
      const body = JSON.stringify(error.response.data);
      Vue.prototype.$notify.error({
        title: error.response.status,
        dangerouslyUseHTMLString: true,
        message: `<p class="error-info-block">${
          error.request.responseURL
        }</p><p class="error-info-block">${body}</p>`,
        duration: 0,
        position: "bottom-right"
      });
    } else {
      Vue.prototype.$notify.error({
        title: "错误",
        message: error.response.data.errorMsg
      });
    }

    if (error.response.status > 400 && error.response.status < 500) {
      window.sessionStorage.setItem("token", "");
      router.push({ name: "login" });
    }
    return Promise.reject(error);
  }
);

window["store"] = store;
/** 权限指令**/
Vue.directive("has", {
  bind: function(el, binding) {
    const className = binding.value.class; // 这个地方要注意了，看下面页面上的代码，对应取得相应的值
    if (!Vue.prototype.$_has(className)) {
      el.parentNode.removeChild(el);
    }
  }
});
Vue.prototype.$_has = function(val) {
  let isShow = false;
  const btnPowerArr = sessionStorage.getItem("roleKeys");
  if (btnPowerArr === undefined || btnPowerArr === null) {
    return false;
  }
  if (btnPowerArr.indexOf(val) > -1) {
    isShow = true;
  }
  return isShow;
};
new Vue({
  router,
  store,
  render: h => h(App)
}).$mount("#app");
